<script setup>
import {RouterView} from 'vue-router'</script>

<template>
  <el-container>
    <el-aside v-if="$route.name!=='login'" class="menu">
      <el-menu :collapse="false" :default-active="$route.path" :router="true" :unique-opened="true" active-text-color="#ffd04b" background-color="#303133" class="left-menu" text-color="#fff" @select="onSelect">
        <div style="text-align: center;">
          <el-image :src="logoPath" style="width: 100%"/>
        </div>
        <el-menu-item index="/">
          <el-icon class="icon-style">
            <i-ph-app-store-logo-bold/>
          </el-icon>
          <span>专业</span>
        </el-menu-item>
        <el-menu-item index="/student">
          <el-icon class="icon-style">
            <i-ph-student/>
          </el-icon>
          <span>学生</span>
        </el-menu-item>
        <el-menu-item index="/question">
          <el-icon class="icon-style">
            <i-ph-storefront/>
          </el-icon>
          <span>题库</span>
        </el-menu-item>
        <el-menu-item index="/notice">
          <el-icon class="icon-style">
            <i-ant-design-message-outlined/>
          </el-icon>
          <span>公告</span>
        </el-menu-item>
        <el-menu-item index="/exam-mock">
          <el-icon class="icon-style">
            <i-ph-exam/>
          </el-icon>
          <span>申请</span>
        </el-menu-item>
      </el-menu>
    </el-aside>
    <el-main class="container">
      <RouterView/>
    </el-main>
  </el-container>
</template>

<script>
export default {
  name: "App",
  data() {
    return {
      logoPath: import.meta.env.BASE_URL + '/covers.png',
    }
  },
  methods: {
    onSelect(index, routeResult) {
    },
  }
}
</script>
<style lang="scss" scoped>
.menu {
  width: 130px;
  height: calc(100vh);

  .left-menu {
    min-height: 100%;
    border-right: 0;
  }

  &::-webkit-scrollbar {
    display: none;
  }
}

.container {
  max-width: 2000px;
  box-sizing: border-box;
  padding: 0 10px;
  position: relative;
  height: calc(100vh);

  &::-webkit-scrollbar {
    display: none;
  }
}


</style>
